<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head th:replace="~{common/top :: head}">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.7.2/css/all.min.css" integrity="sha512-Evv84Mr4kqVGRNSgIGL/F/aIDqQb7xQ2vcrdIwxfjThSH8CSR7PBEakCr51Ck+w+/U6swU2Im1vVX0SVk9ABhg==" crossorigin="anonymous" referrerpolicy="no-referrer" />
    <link rel="stylesheet" href="../css/mystore.css">
</head>
<body>
<div th:replace="~{common/top}"></div>
<h3>Account Information</h3>
<div id="Catalog" class="Catalog">
    <form th:action="@{/account/register}" th:object="${account}" method="post">
        <table>
            <tr>
                <td>Userid</td>
                <td>
                    <input type="text" name="userid" th:field="*{userid}" class="search-input">
                </td>
            </tr>
            <tr>
                <td>Password</td>
                <td>
                    <input type="password" name="password" th:field="*{password}" class="search-input">
                </td>
            </tr>
            <tr>
                <td>Repeated Password</td>
                <td>
                    <input type="password" name="repeatPassword" class="search-input">
                </td>
            </tr>
            <tr>
                <td>Last name:</td>
                <td>
                    <input type="text" name="lastName" th:field="*{lastName}" class="search-input">
                </td>
            </tr>
            <tr>
                <td>First name:</td>
                <td>
                    <input type="text" name="firstName" th:field="*{firstName}" class="search-input">
                </td>
            </tr>
            <tr>
                <td>Email:</td>
                <td>
                    <input type="email" name="email" size="40" th:field="*{email}" class="search-input">
                </td>
            </tr>
            <tr>
                <td>Phone:</td>
                <td>
                    <input type="text" name="phone" th:field="*{phone}" class="search-input">
                </td>
            </tr>
            <tr>
                <td>Address 1:</td>
                <td>
                    <input type="text" name="address1" size="40" th:field="*{address1}" class="search-input">
                </td>
            </tr>
            <tr>
                <td>Address 2:</td>
                <td>
                    <input type="text" name="address2" size="40" th:field="*{address2}" class="search-input">
                </td>
            </tr>
            <tr>
                <td>City:</td>
                <td>
                    <input type="text" name="city" th:field="*{city}" class="search-input">
                </td>
            </tr>
            <tr>
                <td>State:</td>
                <td>
                    <input type="text" name="state" size="4" th:field="*{state}" class="search-input">
                </td>
            </tr>
            <tr>
                <td>Zip:</td>
                <td>
                    <input type="text" name="zip" size="10" th:field="*{zip}" class="search-input">
                </td>
            </tr>
            <tr>
                <td>Country:</td>
                <td>
                    <input type="text" name="country" size="15" th:field="*{country}" class="search-input">
                </td>
            </tr>
        </table>

        <h3>Profile Information</h3>



        <table>
            <tr>
                <td>Language Preference:</td>
                <td>
                    <input type="radio" name="languagePreference" th:field="*{languagePreference}" value="english">English
                    <input type="radio" name="languagePreference" th:field="*{languagePreference}" value="chinese">Chinese
                </td>
            </tr>
            <tr>
                <td>Favourite Category:</td>
                <td>
                    <input type="radio" name="favouriteCategoryId" th:field="*{favouriteCategoryId}" value="CATS">CATS
                    <input type="radio" name="favouriteCategoryId" th:field="*{favouriteCategoryId}" value="DOGS">DOGS
                    <input type="radio" name="favouriteCategoryId" th:field="*{favouriteCategoryId}" value="FISH">FISH
                    <input type="radio" name="favouriteCategoryId" th:field="*{favouriteCategoryId}" value="BIRDS">BIRDS
                    <input type="radio" name="favouriteCategoryId" th:field="*{favouriteCategoryId}" value="REPTILES">REPTILES
                </td>
            </tr>
            <tr>
                <td>Enable MyList</td>
                <td><input type="checkbox" name="listOption" th:field="*{listOption}" /></td>
            </tr>
            <tr>
                <td>Enable MyBanner</td>
                <td><input type="checkbox" name="bannerOption" th:field="*{bannerOption}" /></td>
            </tr>
        </table>

        <td>
            <input type="text" name="code" class="search-input" style="width: 60px">
            <img th:src="@{/account/captcha}" alt="验证码" onclick="this.src='/account/captcha?d='+new Date().getTime()">
        </td>

        <button type="submit" name="editAccount" class="btn">
            Save Account Information <i class="fa-solid fa-chevron-right"></i>
        </button>
    </form>
</div>

    <div th:replace="~{common/bottom :: footer}"></div>

</body>
</html> 